<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="apple-mobile-web-app-title" content="蓁奕科技" />
    <link rel="stylesheet" href="/components/frozenui/css/frozen.css">
    <!-- <link href="https://cdn.bootcss.com/FrozenUI/1.3.0/css/frozen-min.css" rel="stylesheet"> -->
    <link rel="stylesheet" href="http://res.zhen-yee.com/res/assets/css/amazeui.css" />
    <link rel="stylesheet" href="http://res.zhen-yee.com/res/assets/css/admin.css" />
    <link href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css" rel="stylesheet">
    <meta name="Keywords" content="预订,微信,蓁奕科技,蓁预订,预订系统">
    <meta name="description" content="微信一键预约时间,服务项目,服务人员以及在线支付功能,先上发送订单,商家后台轻松管理,让客人安心等待,让商家有所准备" />
    <title>${title} | 蓁预订，微信预约系统；真的可以预订的系统！</title>
    <link rel="icon" type="image/png" href="http://res.zhen-yee.com/zy/logo50.jpg">
    <!-- <link rel="stylesheet" href="/layer/css/modules/layer/default/layer.css"> -->
    <link href="https://cdn.bootcss.com/layer/2.3/skin/layer.css" rel="stylesheet">
</head>

<body>
    <header data-am-widget="header" class="am-header am-header-default">
        <h1 class="am-header-title">
        ${title}
    </h1>
    </header>
    <div id='app'>
        <form action="/bk/admin/todayBooking/?shopId=${shopId}">
            <div class="ui-form-item ui-form-item-r ui-border-b">
                <label for="#">日期</label>
                <div hidden>
                    <input type="text" name="shopId" value="${shopId}">
                </div>
                <div class="ui-select" style="margin-right: 116px">
                    <select name="selectDay">
                        <#list dates as date>
                            <#if selectDay==date>
                                <option value="${date}" selected="">${date}</option>
                            </#if>
                            <#if selectDay!=date>
                                <option value="${date}">${date}</option>
                            </#if>
                        </#list>
                    </select>
                </div>
                <!-- 若按钮不可点击则添加 disabled 类 -->
                <button type="submit" class="ui-border-l">确认</button>
                <!-- <a href="#" class="ui-icon-close"></a> -->
            </div>
        </form>
        <form class="am-form">
            <table class="am-table am-table-striped am-table-hover table-main">
                <thead>
                    <tr>
                        <th class="table-title">时间</th>
                        <th class="table-title">技师</th>
                        <th class="table-title">项目</th>
                        <th class="table-title">客户</th>
                        <th class="table-title am-hide-sm-only">备注</th>
                        <th class="table-title">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for='item in items'>
                        <td>
                            {{item.bookDate}}
                        </td>
                        <td>
                            {{item.selectionName}}
                        </td>
                        <td>
                            {{item.itemName}}
                        </td>
                        <td>
                            {{item.name}} {{item.phone}}
                        </td>
                        <td class="am-hide-sm-only">
                            <input type="" v-model='item.remark'>
                        </td>
                        <td>
                            <div @click='onSubmit(item)' class="am-btn am-btn-default am-btn-xs am-hide-sm-only">更新</div>
                            <button type="button" :value="item.id" class="am-btn am-btn-default am-btn-xs am-text-danger cancel">
                                <span class="am-icon-trash-o"></span> 取消订单
                            </button>
                        </td>
                    </tr>
                    <#list [] as item>
                        <tr>
                            <td>
                                ${(item.bookDate?string("HH:mm"))!}
                            </td>
                            <td>
                                ${item.selectionName!''}
                            </td>
                            <td>
                                ${item.itemName!''}
                            </td>
                            <td>
                                ${item.name!''} ${item.phone!''}
                            </td>
                            <td>
                                ${item.remark!''}
                                <input type="" name="">
                            </td>
                            <td>
                                <button type="button" value="${item.id}" class="am-btn am-btn-default am-btn-xs am-text-danger cancel">
                                    <span class="am-icon-trash-o"></span> 取消订单
                                </button>
                            </td>
                        </tr>
                    </#list>
                </tbody>
            </table>
        </form>
        <footer data-am-widget="footer" class="am-footer am-footer-default" data-am-footer="{  }">
            <div class="am-footer-miscs ">
                <p>由 <a href="http://www.zhen-yee.com/" title="蓁奕科技" target="_blank" class="">蓁奕科技</a> 提供技术支持
                </p>
                <p>CopyRight©2018 蓁奕科技 Inc.</p>
                <!-- <p>京ICP备13033158</p> -->
            </div>
        </footer>
    </div>
    <div class="js_dialog" id="iosDialog" style="display: none">
        <div class="weui-mask"></div>
        <div class="weui-dialog">
            <div class="weui-dialog__hd"><strong class="weui-dialog__title">提示</strong></div>
            <div class="weui-dialog__bd">是否取消订单</div>
            <div class="weui-dialog__ft">
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">取消</a>
                <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">确定</a>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="http://res.zhen-yee.com/res/assets/js/jquery-2.1.0.js"></script>
    <script type="text/javascript" src="http://res.zhen-yee.com/res/assets/js/amazeui.min.js"></script>
    <!-- <script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script> -->
    <!-- <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script> -->
    <!-- <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script> -->
    <script src="http://res.zhen-yee.com/res/frozenui/lib/zepto.min.js"></script>
    <!-- <script src="http://res.zhen-yee.com/res/frozenui/js/frozen.js"></script> -->
    <script src="https://cdn.bootcss.com/FrozenUI/1.3.0/lib/zepto.min.js"></script>
    <script src="http://res.zhen-yee.com/res/cjwJs/utilsV2.js"></script>
    <script src="http://res.zhen-yee.com/res/layer/layui.js"></script>
    <script src="http://res.zhen-yee.com/res/layer/layer.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.6.6/vue.min.js"></script>
    <script src="https://cdn.bootcss.com/qs/6.5.2/qs.min.js"></script>
  <script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js"></script>
    <script src="/components/utils.js"></script>
</body>
<script type="text/javascript">
var vue = new Vue({
    el: '#app',
    data: {
        items: toJson2(`${data}`)
    },
    created: function() {},
    methods: {
        onEdit(id) {
            alert('sss')
        },
        onSubmit(item) {
            var url = '/bk/admin/updateBookingInfo'
            var param = {
                id: item.id,
                remark: item.remark
            }
            axiosRequest(param, url, '')
            return false;
        },
    }
})
</script>
<script>
$('.cancel').on('click', function() {
    var bookingId = $(this).attr('value')
    $('#iosDialog').fadeIn()
    $('.weui-dialog__btn_primary').on('click', function() {
        var href = '/bk/admin/cancelMobile?bookingId=' + bookingId;
        rquestStatus(href)
        $('#iosDialog').fadeOut()
    })
    $('.weui-dialog__btn_default').on('click', function() {
        $('#iosDialog').fadeOut()
    })
})
</script>

</html>